// 移动端通用JavaScript函数

// 更新状态栏时间
function updateStatusBarTime() {
    const timeElement = document.querySelector('.status-bar-time');
    if (timeElement) {
        const now = new Date();
        const hours = now.getHours().toString().padStart(2, '0');
        const minutes = now.getMinutes().toString().padStart(2, '0');
        timeElement.textContent = `${hours}:${minutes}`;
    }
}

// 模拟加载状态
function simulateLoading(element, callback, time = 1500) {
    if (!element) return;
    
    // 保存原始内容
    const originalContent = element.innerHTML;
    const originalDisabled = element.disabled;
    
    // 显示加载状态
    element.innerHTML = '<span class="loading mr-2"></span> 加载中...';
    element.disabled = true;
    
    // 模拟加载时间
    setTimeout(() => {
        // 恢复按钮状态
        element.innerHTML = originalContent;
        element.disabled = originalDisabled;
        
        // 执行回调
        if (typeof callback === 'function') {
            callback();
        }
    }, time);
}

// 显示提示消息
function showToast(message, type = 'info', duration = 3000) {
    // 创建toast元素
    const toast = document.createElement('div');
    toast.className = `toast toast-${type}`;
    
    // 设置内容
    let icon = '';
    switch (type) {
        case 'success':
            icon = '<i class="fas fa-check-circle"></i>';
            break;
        case 'error':
            icon = '<i class="fas fa-exclamation-circle"></i>';
            break;
        case 'warning':
            icon = '<i class="fas fa-exclamation-triangle"></i>';
            break;
        default:
            icon = '<i class="fas fa-info-circle"></i>';
    }
    
    toast.innerHTML = `
        <div class="toast-content">
            ${icon}
            <span>${message}</span>
        </div>
    `;
    
    // 添加到页面
    document.body.appendChild(toast);
    
    // 显示动画
    setTimeout(() => {
        toast.classList.add('show');
    }, 10);
    
    // 自动关闭
    setTimeout(() => {
        toast.classList.remove('show');
        setTimeout(() => {
            document.body.removeChild(toast);
        }, 300);
    }, duration);
}

// 显示确认对话框
function showConfirm(title, message, confirmText = '确认', cancelText = '取消') {
    return new Promise((resolve) => {
        // 创建对话框元素
        const modal = document.createElement('div');
        modal.className = 'modal';
        
        modal.innerHTML = `
            <div class="modal-content">
                <div class="modal-header">
                    <h3>${title}</h3>
                </div>
                <div class="modal-body">
                    <p>${message}</p>
                </div>
                <div class="modal-footer">
                    <button class="btn btn-outline" id="modal-cancel">${cancelText}</button>
                    <button class="btn btn-primary" id="modal-confirm">${confirmText}</button>
                </div>
            </div>
        `;
        
        // 添加到页面
        document.body.appendChild(modal);
        
        // 显示动画
        setTimeout(() => {
            modal.classList.add('show');
        }, 10);
        
        // 绑定事件
        const confirmBtn = document.getElementById('modal-confirm');
        const cancelBtn = document.getElementById('modal-cancel');
        
        confirmBtn.addEventListener('click', () => {
            modal.classList.remove('show');
            setTimeout(() => {
                document.body.removeChild(modal);
                resolve(true);
            }, 300);
        });
        
        cancelBtn.addEventListener('click', () => {
            modal.classList.remove('show');
            setTimeout(() => {
                document.body.removeChild(modal);
                resolve(false);
            }, 300);
        });
    });
}

// 切换标签页
function switchTab(tabId) {
    // 获取所有标签和内容
    const tabs = document.querySelectorAll('.tab-item');
    const contents = document.querySelectorAll('.tab-content');
    
    // 移除所有活跃状态
    tabs.forEach(tab => tab.classList.remove('active'));
    contents.forEach(content => content.classList.add('hidden'));
    
    // 激活选中的标签和内容
    const selectedTab = document.querySelector(`.tab-item[data-tab="${tabId}"]`);
    const selectedContent = document.querySelector(`.tab-content[data-tab="${tabId}"]`);
    
    if (selectedTab) selectedTab.classList.add('active');
    if (selectedContent) selectedContent.classList.remove('hidden');
    
    // 保存当前标签到本地存储
    localStorage.setItem('currentTab', tabId);
}

// 字数统计
function countWords(inputElement, counterElement, maxLength = 500) {
    if (!inputElement || !counterElement) return;
    
    const text = inputElement.value;
    const count = text.length;
    
    counterElement.textContent = count;
    
    // 如果超过限制，添加警告样式
    if (maxLength && count > maxLength) {
        counterElement.classList.add('text-danger');
    } else {
        counterElement.classList.remove('text-danger');
    }
}

// 初始化页面
document.addEventListener('DOMContentLoaded', function() {
    // 更新状态栏时间
    updateStatusBarTime();
    setInterval(updateStatusBarTime, 60000); // 每分钟更新一次
    
    // 初始化标签切换
    const tabItems = document.querySelectorAll('.tab-item');
    if (tabItems.length > 0) {
        tabItems.forEach(tab => {
            tab.addEventListener('click', function() {
                const tabId = this.getAttribute('data-tab');
                switchTab(tabId);
            });
        });
        
        // 恢复上次选中的标签
        const currentTab = localStorage.getItem('currentTab');
        if (currentTab) {
            switchTab(currentTab);
        } else {
            // 默认选中第一个标签
            const firstTabId = tabItems[0].getAttribute('data-tab');
            switchTab(firstTabId);
        }
    }
    
    // 初始化字数统计
    const textInputs = document.querySelectorAll('[data-word-count]');
    textInputs.forEach(input => {
        const counterId = input.getAttribute('data-word-count');
        const counter = document.getElementById(counterId);
        if (counter) {
            input.addEventListener('input', () => {
                const maxLength = input.getAttribute('data-max-length');
                countWords(input, counter, maxLength ? parseInt(maxLength) : 500);
            });
            // 初始化计数
            countWords(input, counter);
        }
    });
});

// 添加CSS样式
function addStyles() {
    const style = document.createElement('style');
    style.textContent = `
        .toast {
            position: fixed;
            top: 60px;
            left: 50%;
            transform: translateX(-50%) translateY(-20px);
            background-color: rgba(0, 0, 0, 0.8);
            color: white;
            padding: 10px 16px;
            border-radius: 8px;
            z-index: 1000;
            opacity: 0;
            transition: all 0.3s ease;
            max-width: 80%;
        }
        
        .toast.show {
            opacity: 1;
            transform: translateX(-50%) translateY(0);
        }
        
        .toast-content {
            display: flex;
            align-items: center;
        }
        
        .toast-content i {
            margin-right: 8px;
        }
        
        .toast-success {
            background-color: rgba(16, 185, 129, 0.9);
        }
        
        .toast-error {
            background-color: rgba(239, 68, 68, 0.9);
        }
        
        .toast-warning {
            background-color: rgba(245, 158, 11, 0.9);
        }
        
        .modal {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-color: rgba(0, 0, 0, 0.5);
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 1000;
            opacity: 0;
            visibility: hidden;
            transition: all 0.3s ease;
        }
        
        .modal.show {
            opacity: 1;
            visibility: visible;
        }
        
        .modal-content {
            background-color: white;
            border-radius: 12px;
            width: 80%;
            max-width: 320px;
            transform: scale(0.9);
            transition: transform 0.3s ease;
        }
        
        .modal.show .modal-content {
            transform: scale(1);
        }
        
        .modal-header {
            padding: 16px;
            border-bottom: 1px solid var(--border-light);
        }
        
        .modal-header h3 {
            margin: 0;
            font-size: 18px;
            font-weight: 600;
        }
        
        .modal-body {
            padding: 16px;
        }
        
        .modal-footer {
            padding: 12px 16px;
            border-top: 1px solid var(--border-light);
            display: flex;
            justify-content: flex-end;
            gap: 8px;
        }
    `;
    
    document.head.appendChild(style);
}

// 页面加载时添加样式
document.addEventListener('DOMContentLoaded', addStyles); 